@charset "utf-8";
/*!
 * Mixins
 */

@import './variable';
@import './sprites';

@import "./mixin/properties";
@import "./mixin/base-mixin";
@import "./mixin/flex-mixin";
@import "./mixin/border-mixin";
@import "./mixin/ellipsisLn-mixin";
@import "./mixin/radius-mixin";
@import "./mixin/_slidein";
@import "./mixin/_slideout";
@import "./mixin/_fadein";
@import "./mixin/_fadeout";
@import "./mixin/_shake";
@import "./mixin/center-mixin";
@import "./mixin/triangle-mixin";
@import "./mixin/button-mixin";





@mixin bm-mask($bm){
	@each $prefix in '-webkit-','-moz-','-ms-','' {
		#{$prefix}mask-image: url(#{$bm});	
		#{$prefix}mask-repeat: no-repeat;
		#{$prefix}mask-position: 0 0;
		#{$prefix}mask-size: contain;
		#{$prefix}-transform: translate3d(0, 0, 0);
	}
	background-position: center center;
}

@mixin dashboardScroll {
	.dashboardScroll{
		height: 100%;
		overflow-x: hidden;
		overflow-y: scroll;
		-webkit-overflow-scrolling: touch; /*MAKES OVERFLOWN OBJECTS HAVE INERTIA SCROLLING*/
		-webkit-transform: translateZ(0px); /*HELPS THE ABOVE WORK IN IOS5*/
		-webkit-transform: translate3d(0,0,0);
		-webkit-perspective: 1000;
		&:after{
			height: calc(100% + 1px);
		}
	}
} 

@mixin scrolling{
	-webkit-overflow-scrolling: touch;
	overflow:auto;
}

@mixin transition($property:all,$duration:1s,$timing:ease){   
	transition: $property $duration $timing;
	-moz-transition: $property $duration $timing;
	-webkit-transition: $property $duration $timing;
	-o-transition:  $property $duration $timing;
}   
	   
@mixin property-transform{
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    -ms-transition-property: -ms-transform;    
    transition-property: transform;
}



@mixin module-quantity(){
  position: relative;
  white-space: nowrap;
  .decrement,.increment,.quantity{
    margin: 0;
    text-align: center;
  }
  .decrement,.increment{
	border-radius:0.4rem;
	display: -moz-inline-stack;
    display:inline-block;
    font-size: $fs15;
    font-weight: bold;
  }
  .quantity {
    width: 2.6rem;
    height: 2.6rem;
    line-height: 2.6rem;
    font-size: $fs12;
    font-family: verdana;
    -webkit-appearance: none;
    color: $color03;
    border:1px solid $bg00;
    background-color: transparent;
  }
  .increment{
       @include mix-minus();
  }
  .decrement{
    
	@include mix-plus();
  }
  .disabled{
    color:$color01;
  }
}

@mixin green-button($radius:true){
		border-color: $bg04;
		background-color: $bg04;
		color: $color10;
		position: relative;
		display: block;
		margin: 0;
		padding: 0 0.6px;
		border-width: 1.5px;
		border-style: solid;
		@if $radius == true {
			@include radius(0.4rem);
		}
		vertical-align: top;
		text-align: center;
		text-overflow: ellipsis;
		font-size: $fs14;
		line-height: 3.6rem;
		width:100%;
}

@mixin iptbox() {
  display: inline-block;
  height: 2.6rem;
  padding: 0.4rem;
  font-size: 1.5rem;
  line-height: 2.6rem;
  color: $color01;
  border: 1px solid $border01;
}


@mixin btn-public(){
  display: inline-block;
  cursor: pointer;
  text-align: center;
  vertical-align: middle;
  position: relative;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  touch-action: manipulation;
}

@mixin btn-size($type:default){
  @if $type == minier {

  } @else if $type == xs {

  } @else if $type == sm {

  } @else if $type == lg {

  } @else {
    padding:0;
    font-size:$fs14;
    width:7.8rem;
    height:2.6rem;
    line-height: 2.6rem;
  }
}

@mixin btn-radius(){
   @include radius(.4rem);
}
@mixin btn-white{
  @include btn-public();
  @include btn-size();
  @include btn-radius();
  background-color: $bg00!important;
  border:1.5px solid #7dce89;
  text-shadow: none!important;
  color:$color04;
}